<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="core" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="secured" uri="http://www.springframework.org/security/tags" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>

<secured:authorize ifAnyGranted="ROLE_VER_CLIENTES, ROLE_ACTUALIZAR_CLIENTE">
<head>
	
</head>
<body>
	<div class="contenedor grande">
		<form:form commandName="modeloCliente" action="clientes.do" method="post" acceptCharset="UTF-8" autocomplete="off">
			<form:hidden path="accion" />
			<form:hidden path="id" />
			<form:hidden path="tipo" />
			
			<form:errors cssClass="mensaje-error-campo" />
			
			<!-- BOTONES -->
			<div class="botones">
				<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
					<button type="button" onclick="javascript:cancelar();" class="derecha"><spring:message code="etiqueta.cancelar" text="Cancelar" /></button>
				</secured:authorize>
				<secured:authorize ifNotGranted="ROLE_ACTUALIZAR_CLIENTE">
					<secured:authorize ifAnyGranted="ROLE_VER_CLIENTES">
						<button type="button" onclick="javascript:cancelar();" class="derecha"><spring:message code="etiqueta.volver" text="Volver" /></button>
					</secured:authorize>
				</secured:authorize>
				<button type="button" onclick="javascript:primera();"><spring:message code="etiqueta.informacion" text="Información" /></button>
				<button type="button" onclick="javascript:segunda();"><spring:message code="etiqueta.cuentas" text="Cuentas" /></button>
			</div>
			
			<!-- PAGINAS -->
			<div class="paginas">
				<div id="primera" class="pagina">
					<h2><spring:message code="etiqueta.datosCliente" text="Datos del cliente." /></h2>
			
					<!-- NO EDITABLES -->
					<div class="campo horizontal">
		      			<form:label path="tipo"><spring:message code="etiqueta.tipoCliente" text="Tipo de cliente" /></form:label>
						<form:input path="tipo" disabled="true" />
		      		</div>
		      		<div class="separador">
						&nbsp;
					</div>
					
		      		<!-- PRIMER FILA -->
					<div class="campo horizontal">
						<form:label path="razonSocial"><spring:message code="etiqueta.razonSocial" text="Razón Social" />
							<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
								<span class="requerido"><spring:message code="etiqueta.requerido" text="(Requerido)" /></span>
							</secured:authorize>
		      			</form:label>
						
						<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
							<spring:message code="etiqueta.razonSocial" text="Razón Social" var="placeholder" />
							<form:input path="razonSocial" maxlength="250" tabindex="1" placeholder="${placeholder}" autofocus="autofocus" cssClass="solo-texto" cssErrorClass="solo-texto campo-error" />
							<form:errors cssClass="mensaje-error-campo" path="razonSocial" />
						</secured:authorize>
						
						<secured:authorize ifNotGranted="ROLE_ACTUALIZAR_CLIENTE">
							<form:input path="razonSocial" disabled="true" />
						</secured:authorize>
					</div>
					<div class="campo horizontal">
						<form:label path="nombre"><spring:message code="etiqueta.nombre" text="Nombre" />
							<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
								<span class="requerido"><spring:message code="etiqueta.requerido" text="(Requerido)" /></span>
							</secured:authorize>
		      			</form:label>
						
						<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
							<spring:message code="etiqueta.nombre" text="Nombre" var="placeholder" />
							<form:input path="nombre" maxlength="25" tabindex="2" placeholder="${placeholder}" cssClass="solo-texto" cssErrorClass="solo-texto campo-error" />
							<form:errors cssClass="mensaje-error-campo" path="nombre" />
						</secured:authorize>
						
						<secured:authorize ifNotGranted="ROLE_ACTUALIZAR_CLIENTE">
							<form:input path="nombre" disabled="true" />
						</secured:authorize>				
					</div>
					<div class="campo horizontal">
						<form:label path="rut"><spring:message code="etiqueta.rut" text="RUT" />
							<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
								<span class="requerido"><spring:message code="etiqueta.requerido" text="(Requerido)" /></span>
							</secured:authorize>
		      			</form:label>
						
						<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
							<spring:message code="etiqueta.rut" text="RUT" var="placeholder" />
							<spring:message code="hint.rut" text="Ingrese el número de registro único tributario de la empresa." var="title" />
							<form:input path="rut" maxlength="25" tabindex="3" placeholder="${placeholder}" title="${title}" cssClass="solo-numero" cssErrorClass="solo-numero campo-error" />
							<form:errors cssClass="mensaje-error-campo" path="rut" />
						</secured:authorize>
						
						<secured:authorize ifNotGranted="ROLE_ACTUALIZAR_CLIENTE">
							<form:input path="rut" disabled="true" />
						</secured:authorize>
				    </div>
				    <div class="separador">
						&nbsp;
					</div>
					
					<!-- SEGUNDA FILA -->
					<div class="campo url horizontal">
		      			<form:label path="url"><spring:message code="etiqueta.url" text="URL" /></form:label>
									
						<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
							<spring:message code="etiqueta.url" text="URL" var="placeholder" />
							<form:input path="url" maxlength="250" tabindex="4" placeholder="${placeholder}" cssErrorClass="campo-error" />
							<form:errors cssClass="mensaje-error-campo" path="url" />
						</secured:authorize>
						
						<secured:authorize ifNotGranted="ROLE_ACTUALIZAR_CLIENTE">
							<form:input path="url" disabled="true" />
						</secured:authorize>
		      		</div>
		      		<div class="separador">
						&nbsp;
					</div>
					
					<!-- TERCER FILA -->
					<div class="campo comentario horizontal">
		      			<form:label path="comentarios"><spring:message code="etiqueta.comentarios" text="Comentarios" /></form:label>
						
						<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE" var="autorizado"  />
						<core:choose>
							<core:when test="${autorizado}">
								<form:textarea path="comentarios" maxlength="500" tabindex="5" />					
							</core:when>
							<core:otherwise>
								<form:textarea path="comentarios" disabled="true" />
							</core:otherwise>
						</core:choose>
					</div>
					<div class="separador">
						&nbsp;
					</div>
					
					<!-- BOTONES -->
					<secured:authorize ifAnyGranted="ROLE_ACTUALIZAR_CLIENTE">
			      		<button type="submit" tabindex="18"><spring:message code="etiqueta.actualizar" text="Actualizar" /></button>
			      	</secured:authorize>
			      	
				</div>
				<div id="segunda" class="pagina">
					<h2><spring:message code="etiqueta.cuentas" text="Cuentas." /></h2>
				
					<div class="cuentas horizontal"></div>
				
					<div class="separador">
						&nbsp;
					</div>
					
				</div>
			</div>
		</form:form>
	</div>
	
	<!-- JAVASCRIPT -->
	<script type="text/javascript">
		var tabla;
		var cabezales = [
   			'<spring:message code="etiqueta.cuenta" text="Cuenta" />',
   			'<spring:message code="etiqueta.estado" text="Estado" />',
   			'<spring:message code="etiqueta.creditos" text="Creditos" />',
   			'<spring:message code="etiqueta.debitos" text="Debitos" />',
   			'<spring:message code="etiqueta.balance" text="Balance" />',
   			'<spring:message code="etiqueta.fechaCreacion" text="Fecha de creación" />',
   			''
   		];
	
		jQuery(document).ready(function(){

			cuentas();
			
			jQuery("form[id=modeloCliente]").validity(function() {

				//Requerido. Entre 2 y 25 caracteres (inclusive)
				jQuery("#nombre")
					.require('<spring:message code="mensaje.nombreRequerido" text="Por favor, ingrese el nombre." />')
					.minLength(2)
					.maxLength(25);

				//Requerido. Entre 2 y 25 caracteres (inclusive)
				jQuery("#razonSocial")
					.require('<spring:message code="mensaje.razonSocialRequerida" text="Por favor, ingrese la razón social." />')
					.minLength(2)
					.maxLength(25);

				//Requerido. Entre 2 y 25 caracteres (inclusive)
				jQuery("#rut")
					.require('<spring:message code="mensaje.numeroRutRequerido" text="Por favor, ingrese el número de registro único tributario de la empresa." />')
					.minLength(20)
					.maxLength(25);

				//Requerido. Entre 2 y 25 caracteres (inclusive)
				jQuery("#url")
					.match('url')
					.maxLength(250);

			});
		});

		function cuentas() {
			jQuery.ajax(
			    {
			        url: "cuentas.json",
			        cache: false,
			        contentType: 'application/json; charset=UTF-8',
			        dataType: 'json',
			        data: {
				        accion: 'LISTAR',
				        id: '${modeloCliente.id}'
				    }
			    }
			).done(
				function(cuentas) {
					var datos = [];
					
		   			//Datos
		   			if(cuentas.length > 0){
	       				jQuery.each(cuentas, function(index, value){
	       					var cuenta = jQuery(value)[0];
	       					var id = cuenta.id;
	       					var estado = '';
	       					
	       					switch(cuenta.estado) {
					   		case 'CREADA':
						   		estado = '<spring:message code="etiqueta.estadoCuenta.CREADA" text="Creada" />';
						   		break;
					   		case 'ACTIVA':
					   			estado = '<spring:message code="etiqueta.estadoCuenta.ACTIVA" text="Activa" />';
						   		break;
					   		case 'INACTIVA':
					   			estado = '<spring:message code="etiqueta.estadoCuenta.INACTIVA" text="Inactiva" />';
						   		break;
					   		case 'CANCELADA':
					   			estado = '<spring:message code="etiqueta.estadoCuenta.CANCELADA" text="Cancelada" />';
						   		break;
					   		case 'CERRADA':
					   			estado = '<spring:message code="etiqueta.estadoCuenta.CERRADA" text="Cerrada" />';
						   		break;
				   			}

	       					datos.push([
  								id,
  								estado,
  								cuenta.creditos,
  								cuenta.debitos,
  								cuenta.balance,
  								cuenta.fechaCreacion,
  								links(id, cuenta.estado)
			  		       	]);
	       				});
		   			}
			   		
		   			tabla = $(".cuentas").handsontable(
		   		   		{
		   		   			autoWrapRow: true,
		   		   			colHeaders : cabezales,
		   		   			colWidths : [80, 80, 80, 80, 80, 150, 280],
		 	   		   		columns: [
		 	   		   	    	{data: 0},
		 	   		   	    	{data: 1},
		 	   		   	    	{data: 2},
		 	   		   	    	{data: 3},
		 	   		   	    	{data: 4},
		 	   		   	 		{data: 5},
		 	   		   	    	{data: 6, type: {renderer: textoHtml}}
		 	   		   	  	],
		   		   			columnSorting : true,
		   		   			contextMenu : false,
		   		   			currentRowClassName : 'seleccionado',
		   	   		   		data: datos,
		   	   		   		maxCols : 7,
		   	   				minCols : 7,
		   	   				minRows : 1,
		   	   		  		stretchH: 'last'
		   	   		   	}
		   	   		);
				}
			);
		}

		function links(id, estado) {
			var texto = '<span class="link">';

			<secured:authorize ifAnyGranted="ROLE_VER_CUENTAS">
			texto += '<a class="link-accion" href="javascript:redirige(&quot;cuentas.do?accion=ACTUALIZAR&id=' + id + '&quot;);"><spring:message code="etiqueta.ver" text="Ver" /></a>';
			</secured:authorize>
			texto += '</span>';

   	   	  	texto += '<span class="link">';
   	   	  	switch(estado) {
		   	   	case 'CREADA':
			   	   	<secured:authorize ifAnyGranted="ROLE_BLOQUEAR_CUENTA">
		   	   		texto += '<a class="link-accion" href="javascript:activar(' + id + ');"><spring:message code="etiqueta.activar" text="Activar" /></a>';
		   	   		</secured:authorize>		   	   		
			   		break;
		   		case 'ACTIVA':
		   			<secured:authorize ifAnyGranted="ROLE_BLOQUEAR_CUENTA">
		   	   		texto += '<a class="link-accion" href="javascript:desactivar(' + id + ');"><spring:message code="etiqueta.inactivar" text="Inactivar" /></a>';
		   	   		</secured:authorize>
			   		break;
		   		case 'INACTIVA':
		   			<secured:authorize ifAnyGranted="ROLE_BLOQUEAR_CUENTA">
		   	   		texto += '<a class="link-accion" href="javascript:activar(' + id + ');"><spring:message code="etiqueta.activar" text="Activar" /></a>';
		   	   		</secured:authorize>
			   		break;
		   		default:
		   			texto += '';
			   		break;
   	   	  	}
   	   		texto += '</span>';
   	   		
   	   		texto += '<span class="link">';
   	   		<secured:authorize ifAnyGranted="ROLE_CANCELAR_CUENTA">
   	   		texto += '<a class="link-accion" href="javascript:cancelar(' + id + ');"><spring:message code="etiqueta.cancelar" text="Cancelar" /></a>';
   	   		</secured:authorize>
   	   		texto += '</span>';

   	   		texto += '<span class="link">';
   	   		<secured:authorize ifAnyGranted="ROLE_CERRAR_CUENTA">
	   		texto += '<a class="link-accion" href="javascript:cerrar(' + id + ');"><spring:message code="etiqueta.eliminar" text="Eliminar" /></a>';
	   		</secured:authorize>
	   		texto += '</span>';
   	   	   	   	
	   	   	return texto;
		}

		<secured:authorize ifAnyGranted="ROLE_BLOQUEAR_CUENTA">
		function activar(id) {
			accion(id, 'ACTIVAR');
		}

		function desactivar(id) {
			accion(id, 'DESACTIVAR');
		}
		</secured:authorize>

		<secured:authorize ifAnyGranted="ROLE_CANCELAR_CUENTA">
		function cancelar(id) {
			accion(id, 'CANCELAR');
		}
		</secured:authorize>

		<secured:authorize ifAnyGranted="ROLE_CERRAR_CUENTA">
		function eliminar(id) {
			accion(id, 'CERRAR');
		}
		</secured:authorize>

		<secured:authorize ifAnyGranted="ROLE_BLOQUEAR_CUENTA, ROLE_CANCELAR_CUENTA, ROLE_CERRAR_CUENTA">
		function accion(id, accion) {
			jQuery.ajax(
			    {
			        url: "cuentas.json",
			        cache: false,
			        contentType: 'application/json; charset=UTF-8',
			        dataType: 'json',
			        data: {
				        accion: accion,
				        id: id
				    }
			    }
			).done(
				function(json){
					if(json.mensaje != "OK") {
						mensajeError(json.mensaje, false, null);
					}
					cuentas();
				}
			);
		}
		</secured:authorize>
	</script>
</body>
</secured:authorize>